<template>
    <div>
        <h2>诊断管理</h2>
        <div class="head">
            <div class="my_btn">
                <el-button @click="toEdit" size="small" type="success" class="el-icon-plus">
                    新增
                </el-button>
                <download-excel style="margin: 0 10px;"
                    class="export-excel-wrapper"
                    :data="tableData"
                    :fields="json_fields"
                    type="xls"
                    worksheet="My Worksheet"
                    name="诊断管理"
                >
                    <el-button size="small" type="success" class="el-icon-upload">
                        导出
                    </el-button>
                </download-excel>
                <el-button size="small" @click="showAll">全部</el-button>
                <el-button size="small" @click="showNew">新开单</el-button>
                <el-button size="small" @click="showDoing">进行中</el-button>
                <el-button size="small" @click="showFinished">已完成</el-button>
                <el-button size="small" @click="showPaused">已暂停</el-button>
                <el-button size="small" @click="showCanceled">已取消</el-button>
            </div>
            <div class="search">
                <el-input placeholder="查找...请输入患者姓名" v-model="searchContent" class="input-with-select">
                    <el-button @click="searchDiagnosis" slot="append" icon="el-icon-search"></el-button>
                </el-input>
            </div>
        </div>
        <template>
            <el-table :data="tableData" style="width: 100%" :default-sort="{ prop: 'date', order: 'descending' }">
                <el-table-column prop="type" label="类型" width='100' align="center">
                    <template slot-scope="scope">
                        <el-tag disable-transitions v-if="scope.row.type == 0">
                            门诊
                        </el-tag>
                        <el-tag disable-transitions v-if="scope.row.type == 1">
                            住院
                        </el-tag>
                    </template>
                </el-table-column>
                <el-table-column prop="clinicNumber" label="门诊编号" width='auto' align="center">
                </el-table-column>
                <el-table-column prop="title" label="标题" width='auto' align="center">
                </el-table-column>
                <el-table-column prop="patient" label="患者姓名" width='auto' align="center">
                </el-table-column>
                <el-table-column prop="depName" label="会诊科室" width='auto' align="center">
                </el-table-column>
                <el-table-column prop="bedNumber" label="住院床号" width='auto' align="center">
                </el-table-column>
                <el-table-column prop="username" label="负责人" width='auto' align="center">
                </el-table-column>
                <el-table-column prop="amount" label="金额" width='100' align="center">
                </el-table-column>
                <el-table-column prop="createTime" label="时间" width='130' sortable align="center">
                </el-table-column>
                <el-table-column prop="drugCount" label="药品数量" width='100' align="center">
                    <template slot-scope="scope">
                        <el-tag style="cursor: pointer;" @click="toItem(scope.row)" disable-transitions>{{
                            scope.row.drugCount
                        }}</el-tag>
                    </template>
                </el-table-column>
                <el-table-column prop="isPaid" label="是否付款" width='auto' align="center">
                    <template slot-scope="scope">
                        <el-tag disable-transitions v-if="scope.row.isPaid == 0">
                            未付款
                        </el-tag>
                        <el-tag disable-transitions v-if="scope.row.isPaid == 1">
                            已付款
                        </el-tag>
                        
                    </template>
                </el-table-column>
                <el-table-column prop="status" label="状态" width='100' align="center">
                    <template slot-scope="scope">
                        <el-tag disable-transitions type="warning" v-if="scope.row.status == 0">
                            新开单
                        </el-tag>
                        <el-tag disable-transitions type="primary" v-if="scope.row.status == 1">
                            进行中
                        </el-tag>
                        <el-tag disable-transitions type="success" v-if="scope.row.status == 2">
                            已完成
                        </el-tag>
                        <el-tag disable-transitions type="info" v-if="scope.row.status == 3">
                            已暂停
                        </el-tag>
                        <el-tag disable-transitions type="" v-if="scope.row.status == 4">
                            已取消
                        </el-tag>
                    </template>
                </el-table-column>
                <el-table-column label="操作" align="center">
                    <template slot-scope="scope">
                        <el-button type="primary" size="mini" class="el-icon-edit"
                            @click="handleEdit(scope.$index, scope.row)">修改</el-button><br>
                        <el-button type="primary" size="mini" class="el-icon-search"
                            @click="handlePrint(scope.$index, scope.row)">查看</el-button><br>
                        <el-button size="mini" class="el-icon-close" type="danger"
                            @click="handleDelete(scope.$index, scope.row)">删除</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </template>
        <Pagination @getPagination="getPagination" :total="total" :pageSize="pageSize"></Pagination>
        <vue-easy-print  v-show="false" ref="easyPrint" :table-show="false" :space-row="true">
            <PrintTable id="printTable" :printData="printData2">

            </PrintTable>
        </vue-easy-print>
    </div>
</template>

<script>
import Pagination from '@/components/Pagination'
import PrintTable from './PrintTable.vue'//打印模板组件
import vueEasyPrint from "vue-easy-print";//打印插件

export default {
    name: 'List',
    components: {
        Pagination,
        PrintTable,
        vueEasyPrint,
    },
    data() {
        return {
            pageSize:7,
            total:0,
            searchContent:'',
            printData2:'',
            t:false,
            json_fields: {//声明字段，制作表头
                类型: "type", //常规字段
                门诊编号: "clinicNumber", //支持嵌套属性
                标题: "title", //常规字段
                患者姓名: "patient", //常规字段
                会诊科室: "depName", //常规字段
                住院床号: "bedNumber", //常规字段
                负责人: "username", //常规字段
                金额: "amount", //常规字段
                时间: "createTime", //常规字段
                药品数量: "drugCount", //常规字段
                是否付款: "isPaid", //常规字段
                状态: "status", //常规字段
            },
            tableData: [
                {
                    // "id": 1,
                    // "patient":'张三',
                    // "clinicNumber": 0,//门诊编号
                    // "type": 1,//类型
                    // "title": "12",//标题
                    // "depName": "妇科",//会诊科室
                    // "bedNumber": "1-1-1",//住院床号
                    // "username": "sda",//负责人
                    // "amount": 10.1,//金额
                    // "status": 1,//状态
                    // "isPaid": 1,//是否付款
                    // "createTime": "2022-02-18",//时间
                    // "drugCount":2,//药品数量
                    // "drugInventoryList": null,//药品
                    // "isDeleted": null
                }
            ],
        }
    },
    created(){
        // this.$axios({
        //     method:'get',
        //     url:'/diagnosis/diagnosisManagement/findDiagnosisList',
        //     params:{
        //         "currentPage":1,//当前页数默认第一页
        //         "pageSize":7,//每页显示记录数
        //     }
        // })
        // .then(resp=>{
        //     this.total=parseInt(resp.data.data.total);
        //     this.tableData=resp.data.data.list;
        // })
        this.getAll()

    },
    methods: {
        async getAll(){//获取所有诊断信息
            let params={"currentPage":1,"pageSize":7};
            let res = await this.$api.diagnosis.getDiagnosisList(params);
            this.total=parseInt(res.data.data.total);
            this.tableData=res.data.data.list;
            console.log(res);
        },
        handleEdit(index, row) {//修改,跳转到修改页
            // console.log(index, row);
            this.$router.push({path:'/Diagnosis/Edit2',query:{id:row.id}})
        },
        toItem(row) {//药品数量，跳转到开药单
            this.$router.push({path:'/Diagnosis/Item',query:{id:row.id}})
        },
        handlePrint(index, row){//查看、打印
            this.printData2=row;
            console.log(this.printData2);
            setTimeout(() =>{
                this.$refs.easyPrint.print();
            },100);
            // this.$refs.easyPrint.print()
        },
        searchDiagnosis(){//条件查询
            this.$axios({
                method:'get',
                url:'/diagnosis/diagnosisManagement/findDiagnosisByPatientCondition',
                params:{
                    condition:this.searchContent,
                    currentPage:1,
                    pageSize:10,
                }
            })
            .then(resp=>{
                this.total=parseInt(resp.data.data.total);
                this.tableData=resp.data.data.list;
            })
        },
        handleDelete(index, row) {//删除
            this.$confirm('此操作将删除该诊断信息, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                // 执行删除
                if((row.status==2 || row.status==4) && row.isPaid==1){
                    this.$axios.post(`/diagnosis/diagnosisManagement/deleteDiagnosisById?id=${row.id}`)
                    .then(resp=>{
                        console.log(resp.data);
                        this.$axios({//删除成功后重新渲染页面
                            method:'get',
                            url:'/diagnosis/diagnosisManagement/findDiagnosisList',
                            params:{
                                "currentPage":1,//当前页数默认第一页
                                "pageSize":7,//每页显示记录数
                            }
                        })
                        .then(resp=>{
                            this.total=parseInt(resp.data.data.total);
                            this.tableData=resp.data.data.list;
                            this.$message({
                                type: 'success',
                                message: '删除成功!'
                            });
                        })
                    })
                }else{
                    this.$message({
                        message: '根据状态显示，该诊断信息暂时无法删除',
                        type: 'warning'
                    });
                }
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消删除'
                });
            });
        },
        showAll(){//展示全部
            this.$axios({
                method:'get',
                url:'/diagnosis/diagnosisManagement/findDiagnosisList',
                params:{
                    "currentPage":1,//当前页数默认第一页
                    "pageSize":7,//每页显示记录数
                }
            })
            .then(resp=>{
                this.total=parseInt(resp.data.data.total);
                this.tableData=resp.data.data.list;
            })
        },
        showNew(){//展示新开单
            this.$axios({
                method:'get',
                url:'/diagnosis/diagnosisManagement/findDiagnosisByStatus',
                params:{
                    currentPage:1,//当前页数默认第一页
                    pageSize:7,//每页显示记录数
                    status:'0',
                }
            })
            .then(resp=>{
                
                this.total=parseInt(resp.data.data.total);
                this.tableData=resp.data.data.list;
            })
        },
        showDoing(){//展示进行中
            this.$axios({
                method:'get',
                url:'/diagnosis/diagnosisManagement/findDiagnosisByStatus',
                params:{
                    currentPage:1,//当前页数默认第一页
                    pageSize:7,//每页显示记录数
                    status:'1',
                }
            })
            .then(resp=>{
                
                this.total=parseInt(resp.data.data.total);
                this.tableData=resp.data.data.list;
            })
        },
        showFinished(){//展示已完成
            this.$axios({
                method:'get',
                url:'/diagnosis/diagnosisManagement/findDiagnosisByStatus',
                params:{
                    currentPage:1,//当前页数默认第一页
                    pageSize:7,//每页显示记录数
                    status:'2',
                }
            })
            .then(resp=>{
                
                this.total=parseInt(resp.data.data.total);
                this.tableData=resp.data.data.list;
            })
        },
        showPaused(){//展示已暂停
            this.$axios({
            method:'get',
                url:'/diagnosis/diagnosisManagement/findDiagnosisByStatus',
                params:{
                    currentPage:1,//当前页数默认第一页
                    pageSize:7,//每页显示记录数
                    status:'3',
                }
            })
            .then(resp=>{
               
                this.total=parseInt(resp.data.data.total);
                this.tableData=resp.data.data.list;
            })
        },
        showCanceled(){//展示已取消
            this.$axios({
                method:'get',
                url:'/diagnosis/diagnosisManagement/findDiagnosisByStatus',
                params:{
                    currentPage:1,//当前页数默认第一页
                    pageSize:7,//每页显示记录数
                    status:'4',
                }
            })
            .then(resp=>{
                
                this.total=parseInt(resp.data.data.total);
                this.tableData=resp.data.data.list;
            })
        },
        toEdit() {//新增，跳转到新增
            this.$router.push('/Diagnosis/Edit')
        },
        //获取点击的页码-------------------------------
        getPagination(page) {
            this.$axios({
                method:'get',
                url:'/diagnosis/diagnosisManagement/findDiagnosisList',
                params:{
                    "currentPage":page,//当前页数默认第一页
                    "pageSize":7,//每页显示记录数
                }
            })
            .then(resp=>{
                
                this.tableData=resp.data.data.list;
            })
        }

    }
}
</script>

<style lang="less" scoped>
h2 {
    text-align: left;
    margin: 10px;
}

.head {
    margin: 5px;
    padding: 10px;
    height: 40px;
    border-top: 5px solid gainsboro;
    border-radius: 5px;
    background-color: white;
}

.my_btn {
    float: left;
    display: flex;
}

.search {
    float: right;

}

.my_search {
    padding: 5px;
}
</style>